<template>
	<view class="options">
		<view class="option" v-for="item in vote.voteItemList">
			<view class="name_vote_number">
				<text class="name">{{item.name}}</text>
				<view class="number"> [ {{item.number}} ] 票</view>
			</view>
			<view>
				<view class="detail" @click="goVotePeopleDetail(item.id,item.name)">查看明细</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {getBaseUrl, requestUtil} from "../../utils/requestUtil.js"
	
	export default{
		
		data(){
			return{
				vote:{}
			}
		},
		onLoad(e) {
			console.log(e.id);
			this.getVoteInfo(e.id)
		},
		methods:{
			getVoteInfo:async function(id){
				const result=await requestUtil({url:"/vote/"+id,method:"get"});
				console.log(result)
				this.vote=result.vote;
			},
			goVotePeopleDetail:function(itemId,itemName){
				uni.navigateTo({
					url:"/pages/votePeopleDetail/votePeopleDetail?voteId="+this.vote.id+"&voteItemId="+itemId+"&voteItemName="+itemName
				})
			}
		}
		
	}
</script>

<style lang="scss">
	
	.options{
		margin-top: 0px;
		padding: 10px;
		padding-top: 0px;
		padding-bottom: 70px;
		.option{
			margin-top: 10px;
			display: flex;
			justify-content: space-between;
			padding: 15px;
			border-radius: 10px;
			background-color: white;
			.name_vote_number{
				.name{
					padding-left: 2px;
					font-weight: bolder;
				}
				.number{
					padding-top: 5px;
					color: blue;
					font-size: 11px;
				}
			}
			.detail{
				margin-top: 10px;
				padding: 5px;
				padding-top: 8px;
				padding-bottom: 8px;
				border-radius: 10px;
				background-color: #e6eeff;
				font-size: 12px;
				width: 55px;
				
				text-align: center;
			}
		}
	}
	
</style>